@extends('master')
@section('style')
<style>
	#content{margin-top: 80px;font-size: 14px; margin-top: 80px;}
	#topic-big-btn{background: #eff6fA;border: 1px solid #cce1ef;padding: 34px;width: 268px;height:145px;border-radius: 5px;line-height: 40px;font-size: 12px;cursor: pointer;}
	#topic-tj{border-top: 1px solid #ddd;width: 270px;margin-top: 20px;font-size: 12px;padding: 20px 0px;}
	#topic-tj-title{font-size: 14px;opacity: 0.8;}
	#topic-tj-xq img{border-radius: 5px;cursor: pointer;}
	#topic-tj-xq li div{line-height: 40px;padding: 10px;margin-top: 10px;font-size: 12px;}
	#topic-title{border-bottom: 1px solid #ddd;padding: 5px;}
	#topic-title a{font-size: 12px; color: #999;}
	#topic-list{border-bottom: 1px solid #ddd;}
	#topic-list li{margin-top: 10px;line-height: 24px; height: 26px;border: 1px solid #ddd;border-radius: 12px;cursor: pointer;font-size: 12px;margin-right: 20px;padding: 0px 10px;}
	#topic-list li:hover,#topic-list .active{background: #259;border-color: #259;color: white;}
	#topic-xq-title{padding: 10px 0px;}
	#topic-xq-title img{border-radius: 5px;}
	#topic-xq-title span a{font-size: 12px;padding: 0px 5px;line-height: 50px;}
	#topic-xq-title span.active a{color: #999;}
	#topic-item{border-bottom: 1px solid #ddd;}
	#topic-item .col-md-1 .btn{background: #EFF6FA;height: 20px;padding: 0px 10px;margin-top: 10px;}
	#topic-item .col-md-1 .btn:hover{background: #ddd;}
	#topic-item-author{font-size: 12px;color: #999;padding: 10px;}
	#topic-item-footer{font-size: 12px;padding: 0px;}
	#topic-item-xq img{border-radius: 5px;padding: 10px 0px;}
	#topic-item-text{line-height: 25px; height: 125px;overflow: hidden;text-overflow:ellipsis;}
</style>
@endsection
@section('content')
<div id="content" class="container">
	<div class="col-md-8">
		@foreach($articles as $k=>$v)
		<div id="topic-item" class="col-md-12">
			<div id="topic-item-title" class="col-md-12">
				<h5><a href="/article/{{$v->id}}"><b>{{$v->title}}</b></a></h5>
			</div>
			<div class="col-md-1">
				<div class="btn" style="height: 50px;line-height: 50px;"><span class="glyphicon glyphicon-thumbs-up"></span>{{$v->click}}</div>
			</div>
			<div class="col-md-11">
				<div id="topic-item-author" class="col-md-12">
					<span><b><a href="/show/{{$v->user->id}}">{{$v->user->name}}</a></b>搬运工</span>
				</div>
				<div id="topic-item-xq" class="col-md-12">
					<div class="col-md-4" style="padding: 0px;overflow: hidden;">
						<img width="200" src="{{$v->images}}" alt="">
					</div>
					<div class="col-md-7">
						<div id="topic-item-text"><div style="overflow: hidden;text-overflow: ellipsis;">{!! $v['content'] !!}</div><a href="http://nfangxu.cn/article/{{$v->id}}">显示全部</a></div>
					</div>
					<div id="topic-item-footer" class="col-md-12">
						<ul class="list-unstyled list-inline">
							<!-- <li><span id="icon" class="glyphicon glyphicon-plus"></span><a href="">关注问题</a></li> -->
							<li><span id="icon" class="glyphicon glyphicon-comment"></span><a href="">{{$v->discuss}}条评论</a></li>
							<li><span id="icon" class="glyphicon glyphicon-share"></span><a href="">感谢</a></li>
							<li><span id="icon" class="glyphicon glyphicon-share"></span><a href="">分享</a></li>
							<li><span id="icon" class="glyphicon glyphicon-earphone"></span><a href="">举报</a></li>
							<li><a href="">收藏</a></li>
							<li><a href="">申请转载</a></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		@endforeach
	</div>
</div>
@endsection